{% import "header-macros.html" as header_macros %}
{% if section and section.title %}
{% set page_title = "Bevy - " ~ section.title %}
{% elif page and page.title %}
{% set page_title = "Bevy - " ~ page.title %}
{% else %}
{% set page_title = "Bevy - A data-driven game engine built in Rust "%}
{% endif %}

{% if section and section.path %}
{% set path = "/" ~ section.path %}
{% elif page and page.path %}
{% set path = "/" ~ page.path %}
{% else %}
{% set path = ""%}
{% endif %}

<!doctype html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta name='viewport' content="width=device-width, initial-scale=1" />
        <meta property="og:title" content="{{page_title}}" />
        <meta property="og:type" content="website" />
        <meta property="og:url" content="https://bevyengine-cn.github.io{{path}}" />
        <meta property="og:image" content="https://bevyengine-cn.github.io/assets/bevy_logo_fill.png" />
        <meta property="og:description" content="Bevy is a refreshingly simple data-driven game engine built in Rust. It is free and open-source forever!" />
        <link rel="shortcut icon" type="image/png" href="/assets/favicon.png">
        <link rel="stylesheet" href="/site.css" />
        <link href="/atom.xml" rel="alternate" type="application/atom+xml" />
        <title>{{page_title}}</title>
        {% block head_extensions %} {% endblock %}
    </head>

    <body>
        <div class="headerbar-container">
            <nav class="headerbar container">
                <a href="/" class="header-logo">
                    <img src="/assets/bevy_logo_dark.svg" class="logo" alt="bevy logo" />
                </a>
                {% if section and section.path is starting_with("/learn/book_cn/") %}
                    <label class="toggle-nav-mobile" for=show-book-nav>
                        <svg alt="nav bars" width="24" height="24">
                            <g fill="none" stroke="#ececec" stroke-width="2">
                                <path d="m4 6h16" />
                                <path d="m4 11h16" />
                                <path d="m4 16h16" />
                            </g>
                        </svg>
                    </label>
                {% else %}
                    <a href="/" class="header-logo-mobile">
                        <img src="/assets/bevy_icon_dark.svg" class="logo" alt="bevy icon" />
                    </a>
                {% endif %}
                <div class="header-item header-message">
                    {% if section and section.extra.header_message %}
                    {{section.extra.header_message}}
                    {% elif page and page.extra.header_message %}
                    {{page.extra.header_message}}
                    {% elif section and section.path is starting_with("/learn/book_cn/") %}
                        The Book
                    {% elif section and section.path is starting_with("/news/") %}
                        News
                    {% elif page and page.path is starting_with("/news/") %}
                        News
                    {% else %}
                        Features
                    {% endif %}
                </div>
                <div class="header-item header-push"></div>
                {{header_macros::header_item(name="Features", path="/", current_path=current_path)}}
                {{header_macros::header_item(name="Learn", current_path=current_path)}}
                {{header_macros::header_item(name="News", current_path=current_path)}}
                {{header_macros::header_item(name="Community", current_path=current_path)}}
                <a class="header-item header-button header-button-donate" href="https://github.com/sponsors/cart">Donate <img src="/assets/heart.svg" class="header-button-donate-heart" alt="heart icon"/></a>
                <a class="header-item header-button" href="/learn/book_cn/getting-started/">Get Started</a>
            </nav>
        </div>
        <section class="section">
            <div class="container">
                {% block content %} {% endblock %}
            </div>
        </section>
    </body>
</html>
